<!DOCTYPE html>
<html>

<head>

   {include file="Public:header"}

</head>

<body style="color:#333;padding:3px;">
<div style="padding:10px">

    <form action="#" method="post" id="form_check" accept-charset="utf-8" class="form-inline">
        <table class="table table-bordered bud_hei">
            <tr>
                <td style="width: 160px;" rowspan="2">拜访人 <span class="colorRed">*</span></td>
                <td>
                    <div class="form-group">
                        <div class="input-group">
                            <input id="xgry" type="text" placeholder="请输入关键字或空格查询"
                                   class="form-control" value="" style="min-width: 300px;width: 300px">
                            <div class="input-group-btn">
                                <ul class="dropdown-menu dropdown-menu-right" role="menu">
                                </ul>
                            </div>
                        </div>
                    </div>
                    <a href="javascript:;" id="select_xgry" class="btn btn-primary btn-sm">选择</a>
                </td>
            </tr>
            <tr>
                <td id="bfman">
                    <div class="duoxuan"></div>
                </td>
            </tr>
            <tr>
                <td>网点月拜访目标数：<span class="colorRed">*</span></td>
                <td><input type="text" name="wdybfs" class="form-control" id="netbfaim"></td>
            </tr>
            <tr>
                <td>经销商月拜访目标数：<span class="colorRed">*</span></td>
                <td><input type="text" name="jxsybfs" class="form-control" id="agencybfaim"></td>
            </tr>
            <tr>
                <td colspan="2" class="text-center">
                    <button class="btn btn-sm btn-success" type="button" id="save">保存</button>
                </td>
            </tr>
        </table>

    </form>

</div>
<!-- 全局js -->
<script src="__STATIC__/layout/js/jquery.min.js?v=2.1.4"></script>
<script src="__STATIC__/layout/js/bootstrap.min.js?v=3.3.6"></script>
<!-- <script src="js/plugins/metisMenu/jquery.metisMenu.js"></script> -->
<script src="__STATIC__/layout/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="__STATIC__/layout/js/plugins/sweetalert/sweetalert.min.js"></script>
<script src="__STATIC__/layout/js/plugins/layer/layer.min.js"></script>
<script src="__STATIC__/layout/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="__STATIC__/layout/js/plugins/suggest/bootstrap-suggest.min.js"></script>
<script src="__STATIC__/layout/js/common.js"></script>
<script>
    $(document).ready(function () {
        //弹出选择相关人员
        $('#select_xgry').on('click',function () {
            var _this = this
            var index = layer.getFrameIndex(window.name)
            layer.open({
                type:2,
                area:['60%','60%'],
                maxmin:true,
                btn:'确定',
                btnAlign:'c',
                content:'{:url("open/employee")}',
                yes:function (i,o) {
                    var a = $(o).find('iframe').contents()
                    var data = a.find('#data')
                    data = data.val()
                    data = JSON.parse(data)
                    var bool = false
                    for(var j=0;j<data.length;j++){
                        $(_this).closest('tr').find('.duoxuan .ren').each(function (idx, o) {
                            if ($(this).data('id') == data[j].id) {
                                bool = true;
                            }
                        })
                        if (bool == false)
                            $(_this).closest('tr').next('tr').find('.duoxuan').append('<span class="ren" data-id="' + data[j].id + '">' + data[j].title + '<input type="hidden" name="xm[]" value="' + data[j].id + '"><span class="close">×</span></span>')
                    }
                    layer.close(i)
                }
            })
            return  false
        })

        //删除单个选定
        $('body').on('click','.duoxuan .close',function () {

            $(this).closest('.ren').remove()
        })
        //相关人员
        $("#xgry").bsSuggest({
            url:"{:url('Bs/employee')}",
            effectiveFields: ["id", "title"],
            searchFields: [ "title"],
            effectiveFieldsAlias: {title: "名称"},
            ignorecase: true,
            showHeader: true,
            showBtn: false,     //不显示下拉按钮
            delayUntilKeyup: true, //获取数据的方式为 firstByUrl 时，延迟到有输入/获取到焦点时才请求数据
            idField: "id",
            keyField: "title",
            clearable: true
        }).on('onDataRequestSuccess', function (e, result) {
            console.log('onDataRequestSuccess: ', result);
        }).on('onSetSelectValue', function (e, keyword, data) {
            $(this).val('')
            var bool = false
            $(this).closest('tr').next('tr').find('.duoxuan .ren').each(function (idx, o) {
                if ($(this).data('id') == keyword.id) {
                    bool = true;
                }
            })
            if (bool == false)
                $(this).closest('tr').next('tr').find('.duoxuan').append('<span class="ren" data-id="' + keyword.id + '">' + keyword.key + '<input type="hidden" name="xm[]" value="' + keyword.id + '"><span class="close">×</span></span>')
            //console.log('onSetSelectValue: ', keyword, data);
        }).on('onUnsetSelectValue', function () {
            console.log("onUnsetSelectValue");
        });

        $("#save").click(function () {

            if ($(".duoxuan .ren").length == 0) {
                sweetAlert("", "请选择拜访人", "error")
            } else if ($("#netbfaim").val() == "") {
                sweetAlert("", "网点月拜访目标数不能为空", "error")
            } else if ($("#agencybfaim").val() == "") {
                sweetAlert("", "经销商月拜访目标数不能为空", "error")
            } else {
                var param = $(this).closest('form').serialize()
                $.post('',param,function (data) {
                    if(data.success){
                        swal({title:data.msg},function () {
                            parent.layer.close(parent.layer.getFrameIndex(window.name))
                        })
                    }else{
                        swal(data.msg,'','error')
                    }
                },'json')
                return false;
            }
        })
    })
</script>
</body>

</html>
